
a {
	color: #669;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
body {
	font: 8px "Hiragino Maru Gothic ProN",meiryo,"MS Gothic",arial;
}

/************************************************************************************
STRUCTURE
*************************************************************************************/
#pagewrap {
	width: 700px;
	margin: 10px auto;
}
#header {
	height: auto;
}
#content {
	clear: both;

}
#sidebar {
	width: 300px;
	float: right;
}
#footer {
	clear: both;
}
#header img { max-width:100%;
	display: block;
    margin-left: auto;
    margin-right: auto ;
}

table {
    width: 100%;
    table-layout: fixed;
}


/*FORM*/

/************************************************************************************
MEDIA QUERIES
*************************************************************************************/

/* for 980px or less */
@media screen and (max-width: 1920px) {
	
	#pagewrap {
		font-size:12px;
	}
	.contentImage img { max-width:100%;
		margin-left: auto;
		margin-right: auto ;
	}
	.contentImage table {
		width: 100%;
		table-layout: fixed;
	}
	#sidebar {
		width: 30%;
	}
	
	.error{
		width: 98%;
		background:#CCC;
		border: 1px solid #FC7;
		vertical-align: top;
		line-height: 130%;
		margin: 0 0 10px 0;
		padding:5px;
		color:#FC0000;
	}
		.row {
		 width:100%;
		 display:table;
	}
	.row1{
		text-align:center;
		background:#FEA;
		border: 1px solid #FC7;
		padding: 10px 0 10px 0;
	}

  	.row .title {
		width: 35%;
		background:#FEA;
		border: 1px solid #FC7;
		vertical-align: top;
		line-height: 130%;
		text-align:left;
		display:table-cell;
		font-weight:inline;
		}
	.row .title th{
		font-weight:normal;
		text-align:left;
		font-size:14px;
	}
	.row .fieldColumn {
		width:100%;
		background:#FFFFFF;
		border: 1px solid #FFCC77;
		padding:2px;
		display:table-cell;
	}
		
	/*input[type=text] {
		width: auto;
		font: 11px bold Tahoma, Arial, sans-serif;
		margin: 1px;
		padding: 2px;
	}

	input[type=text] {
		margin: 1px;
		width: 20%;
		padding: 2px;
		border: 1px solid #aaa;
	}
  input[type=text]{
  padding-top:2px;
	width: 20%; 
  }
  */
  	input [type=text].type1{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	input [type=text].type2{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	input [type=text].type3{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	input [type=text].type4{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	input [type=text].type5{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	  input[type=text].type1{
		
		width: 25%; 
	  }
	  input[type=text].type2{
		
		width: 70%; 
	  }
	   input[type=text].type3{
		width: 230%; 
	  }
	   input[type=text].type4{
		width: 30%; 
	  }
	  input[type=text].type5{
		width: 10%; 
	  }
	   input[type=text].cource{
		padding-top:2px;
		width: 40%; 
	  }
	  input[type=email],
	  input[type=url],
	  input[type=password],
	  select {
		width: 70%; 
	  }
	textarea{
		width:70%;
		height:80px;;
		}
   .rowFieldColumn{
	width:100%;
	padding:2px;
	}
	 .rowFieldColumn .field1 {
		width:150px;
		float:left;
	}
	 .rowFieldColumn .field2{
		padding-left:5px;
		
	}
	
	.col1{
		float:left;
		width:30%;
	}
	.col2{
		float:left;
		width:40%;
		display:relative;
	}
}
@media screen and (max-width: 800px) {
	#pagewrap {
		width: 88%;
	}
	#sidebar {
		width: 30%;
	}

}
/* for 700px or less */
@media screen and (max-width: 768px) {

	
	#header {
		height: auto;
	}
	#sidebar {
		width: auto;
		float: none;
	}
}

/* for 480px or less */
@media screen and (max-width: 480px) {

	#pagewrap {
		width: 100%;
		font-size:11px;
	}
	.contentImage img { max-width:100%;
		display: block;
		margin-left: auto;
		margin-right: auto ;
	}
	#header {
		height: auto;
	}
	h1 {
		font-size: 24px;
	}
	#sidebar {
		display: none;
	}
	
	.contentImage{
		width:100%;
		margin-bottom:10px;
	}
	
	.error{
		width: 96%;
		background:#CCC;
		border: 1px solid #FC7;
		vertical-align: top;
		line-height: 130%;
	}
	
	.row {
		 width:100%;
		 display:block!important;
	}
	.row1{
		width:99%;
		text-align:center;
		background:#FEA;
		border: 1px solid #FC7;
	}
  	.row .title {
		width: 99%;
		background:#FEA;
		border: 1px solid #FC7;
		vertical-align: top;
		line-height: 130%;
		text-align:left;
		/*display:block!important;*/
		}
	.row .title th{
		font-weight:normal;
		text-align:left;
		font-size:11px;
	}
	.row .fieldColumn {
		width:98%;
		background:#FFFFFF;
		border: 1px solid #FFCC77;
		padding:2px;
		display:block!important;
		height:auto;
	}
	.row .fieldColumn  img{
		 max-width:100%;
    margin-left: auto;
    margin-right: auto ;
	}
	.row .fieldColumn  td {
		padding-top: 2px;
		
	}
	input[type=text] {
		width: auto;
		margin: 1px;
		padding: 2px;
	}

	input [type=text].type1{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	input [type=text].type2{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	input [type=text].type3{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	input [type=text].type4{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	input [type=text].type5{
		margin: 1px;
		padding: 2px;
		border: 1px solid #aaa;
	}
	  input[type=text].type1{
		width: 30%; 
	  }
	  input[type=text].type2{
		width: 50%; 
	  }
	  input[type=text].type3{
		width: 50%; 
	  }
	   input[type=text].type4{
		width: 16%; 
	  }
	  input[type=text].type5{
		width: 15%; 
	  }
	  input[type=email],
	  input[type=url],
	  input[type=password],
	  select {
		width: 30%; 
	  }
		textarea{
		width:80%;
		height:80px;;
		}
  
   .rowFieldColumn{
	width:100%;
	padding:2px;
	}
	 .rowFieldColumn .field1 {
		width:150px;
		float:left;
	}
	.rowFieldColumn .field2{
		padding-left:5px;
		
	}
	
	.row3 {
		width:100%;
	}
	.col1{
		
		width:90%;
		float:none;
	}
	.col2{
		float:left;
		width:40%;
		display:none;
	}
	textarea {
    margin: 0px;
    padding: 0px;
}
}

/* border & guideline (you can ignore these) */
#content {
	background: #FFFFFF;
}
#sidebar {
	background: #f0efef;
}
#header, #content, #sidebar {
	margin-bottom: 5px;
}
#pagewrap, #header, #content, #sidebar, #footer {
	border: solid 1px #FFFFFF;
}


/*****************FORM*********************/
  .td-icon{
    padding-right: 5px;
    vertical-align: top;
    border-left: medium none !important;
}
#kiyaku {
    width: 99%;
    height: 200px;
}

